<template>
    <div class="c-baseline">
       <div class="base-line" :style="{'color':color||'#ccc'}">
         {{text}}
       </div>
    </div>
</template>
<script>
export default {
  name: 'c-baseline',
  props: ['text', 'len', 'color'],
  data() {
    return {

    };
  },
};
</script>
<style lang="less">
   .c-baseline{
     font-size: 14px;
     position: relative;
     text-align: center;
      &:before{
        content: '';
        width: 34%;
        display: inline-block;
        position: absolute;
        top: 50%;
        border-bottom: 1px solid #D7D7D7;
        left: 0;
      }
      &:after{
         content: '';
        width: 34%;
        display: inline-block;
        position: absolute;
        top: 50%;
        border-bottom: 1px solid #D7D7D7;
        right: 0;
      }
    }
</style>
